<template>
  <el-row>
    <el-col>
      <div>
        <span class="add-tit1">******图书室</span>
        <span class="add-tit2" @click="handleRedirectToAdmin">
            <img src="/redirect.png" style="width: 32px; height: 32px;" alt="xxx" />
          借阅系统
        </span>
      </div>
    </el-col>
  </el-row>
</template>

<script setup lang="ts">
import { useRouter } from "#app";

const router = useRouter();
const handleRedirectToAdmin = () => {
  router.push("/admin");
};
</script>

<style scoped>
.el-row {
  height: 300px;
  background-image: url("/advise.png");
  background-repeat: no-repeat;
  background-size: initial;
}

.add-tit1 {
  position: relative;
  left: 800px;
  top: 100px;
  font-size: 2em;
  color: white;
}

.add-tit2 {
  position: relative;
  left: 800px;
  top: 150px;
  width: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2em;
  color: white;
  cursor: pointer;
}

</style>
